/**
 * FormEventDialog
 */
 
 import eventHelper from "../../../util/EventHelper";

 var React = require("react");
 var tool = require("../../../util/tool");
 var consts = require("../../../util/consts");
 var WidgetEventForm = require("./../rightbar/WidgetEventForm.js");
 var FormEventDialog = React.createClass({
    getInitialProps: function (){
        return {
            root: {},
            data: {}
        }
    },
    getInitialState: function (){
        return {

        }
    },
    handleOnSubmit: function (){
        var data = this.props.data;
        var form = $(this.refs.form);
        var widget = form[0].state.widget;
        var root = this.props.root;

        root.updateSpecifyWidget(widget);
        eventHelper.trigger(consts.EVENTS.THREED_WIDGET_PROPERTY_CHANGED, widget);
        root.closeDialog();
    },
    handleOnCloseDialog: function (){
        var root = this.props.root;
        root.closeDialog();
    },
    render: function (){
        var root = this.props.root,
            data = this.props.data;
        var rStyle = {
            position: "fixed",
            top: "50%",
            left: "50%",
            width: "400px",
            height: "auto",
            marginLeft: "-200px",
            marginTop: "-335px",
            display: "block",
            borderRadius: '5px',
        };
        return (
            <dialog ref="dialog" style={rStyle} className="btg-modal widget-form">
                <div className='form-horizontal'>
                    <div className="btg-modal-content location-region">
                        <div className="form-horizontal">
                            <div className="widget-form-title">
                                <label>{$._("submit form")}</label>
                            </div>
                            <WidgetEventForm widget={data} root={root} fromTemplate= {true} ref='form'/>
                        </div>
                        <div className="form-group buttons">
                            <button type="button" onClick={this.handleOnSubmit}>
                                <span>{$._("Submit")}</span>
                            </button>
                        </div>
                    </div>
                </div>
                <a href="#" onClick={this.handleOnCloseDialog} className="modal-close icon-close"></a>
            </dialog>
        )
    }
 });

 module.exports = FormEventDialog;
